<!-- HTML5文件 -->
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8"/>
		<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
		<title>Agile Lite</title>
		<link rel="stylesheet" href="../assets/agile/css/agile.layout.css">
		<link rel="stylesheet" href="../assets/third/flat/flat.component.css">
		<link rel="stylesheet" href="../assets/third/flat/flat.color.css">
		<link rel="stylesheet" href="../assets/third/flat/iconline.css">
		<link rel="stylesheet" href="../assets/app/css/app.css">
	</head>
	<body>
		<div id="section_container">
			<section id="index_section" data-role="section" class="active">
				<header>
				    <div class="titlebar">
				    	<a data-toggle="back" href="#"><i class="iconfont iconline-arrow-left"></i></a>
				    	<h1>Flat UI</h1>
				    </div>
				</header>
		
				<article data-role="article" id="flat_article" class="active" data-scroll="verticle" style="top:44px;bottom:0px;">
					<div class="scroller">
						<div class="card">
							<ul class="listitem">
								<li class="sliver">Bases</li>
						        <li href="button.html" data-toggle="html">
						            <i class="ricon iconfont iconline-arrow-right"></i>
						            <div class="text">
						            	按钮组件
						            	<small>button和toggle按钮组件</small>
						            </div>
						        </li>
						        <li href="menu.html" data-toggle="html">
						            <i class="ricon iconfont iconline-arrow-right"></i>
						            <div class="text">
						            	菜单组件
						            	<small>tabbar、menubar和grid菜单</small>
						            </div>
						        </li>
						        <li href="list.html" data-toggle="html">
						            <i class="ricon iconfont iconline-arrow-right"></i>
						            <div class="text">
						            	列表组件
						            	<small>单行/多行列表以及其他列表模板</small>
						            </div>
						        </li>
						        <li href="list_more.html" data-toggle="html">
						            <i class="ricon iconfont iconline-arrow-right"></i>
						            <div class="text">
						            	复杂列表
						            	<small>邮件列表和下载列表</small>
						            </div>
						        </li>
						        <li href="list_edit.html" data-toggle="html">
						            <i class="ricon iconfont iconline-arrow-right"></i>
						            <div class="text">
						            	列表滑动与编辑
						            	<small>滑动删除与批量处理</small>
						            </div>
						        </li>
						        <li href="form.html" data-toggle="html">
						            <i class="ricon iconfont iconline-arrow-right"></i>
						            <div class="text">
						            	表单组件
						            	<small>表单组件及其不同布局</small>
						            </div>
						        </li>
						        <li href="calendar.html" data-toggle="html">
						            <i class="ricon iconfont iconline-arrow-right"></i>
						            <div class="text">
						            	日历组件
						            	<small>万年历、日程管理</small>
						            </div>
						        </li>
						        
						        <li class="sliver">Others</li>
						        <li href="icon.html" data-toggle="html">
						            <i class="ricon iconfont iconline-arrow-right"></i>
						            <div class="text">
						            	常用字体
						            	<small>各种类型的字体图</small>
						            </div>
						        </li>
						        <li href="icon_form.html" data-toggle="html">
						            <i class="ricon iconfont iconline-arrow-right"></i>
						            <div class="text">
						            	表单字体
						            	<small>用于表单的字体图</small>
						            </div>
						        </li>
						        <li href="icon_logo.html" data-toggle="html">
						            <i class="ricon iconfont iconline-arrow-right"></i>
						            <div class="text">
						            	LOGO字体
						            	<small>部分企业logo的字体图</small>
						            </div>
						        </li>
						        <li href="animate.html" data-toggle="html">
						            <i class="ricon iconfont iconline-arrow-right"></i>
						            <div class="text">
						            	CSS3动画
						            	<small>各种风格的CSS3动画（依赖JQuery）</small>
						            </div>
						        </li>
						    </ul>
						</div>
					</div>
				</article>
			</section>
		</div>
		
		<!--- third -->
		<script src="../assets/third/jquery/jquery-2.1.3.min.js"></script>
		<script src="../assets/third/jquery/jquery.mobile.custom.min.js"></script>
		<script src="../assets/third/iscroll/iscroll-probe.js"></script>
		<script src="../assets/third/arttemplate/template-native.js"></script>
		<!---  agile -->
		<script type="text/javascript" src="../assets/agile/js/agile.js"></script>
<script type="text/javascript" src="../assets/bridge/exmobi.js"></script>
<script type="text/javascript" src="../assets/bridge/agile.exmobi.js"></script>			
		<!-- app -->
		<script type="text/javascript" src="../assets/app/js/app.js"></script>

	</body>
</html>